<template>
    <section>
        <!--工具条-->
        <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
            <el-form :inline="true" :model="filters">
                <el-form-item label="运营商" prop="operatoruid">
                    <el-select v-model="filters.operatoruid" filterable clearable placeholder="请选择运营商" collapse-tags>
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in operator"
                                :key="item.operatoruid"
                                :label="item.operatorname"
                                :value="item.operatoruid">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="供货商" prop="useruuid"  >
                    <el-select v-model="filters.upuseruuid" clearable placeholder="请选择供货商" filterable multiple collapse-tags >
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option v-if="users && users.length > 0"
                                v-for="item in usersUp"
                                :key="item.user.useruuid"
                                :label="item.user.username"
                                :value="item.user.useruuid">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="分销商" prop="useruuid">
                    <el-select v-model="filters.useruuid" clearable placeholder="请选择分销商" filterable multiple collapse-tags >
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option v-if="users && users.length > 0"
                                v-for="item in users"
                                :key="item.user.useruuid"
                                :label="item.user.username"
                                :value="item.user.useruuid">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="省份" prop="provinceuuid">
                    <el-select v-model="filters.provinceuuid" filterable clearable placeholder="请选择省份" >
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in info"
                                :key="item.provincename"
                                :label="item.provincename"
                                :value="item.provincename">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="业务类型" prop="busuuid">
                    <el-select v-model="filters.busuuid" filterable clearable placeholder="请选择业务类型">
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in bus"
                                :key="item.busuuid"
                                :label="item.busname"
                                :value="item.busuuid">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary" v-on:click="findPageProductDown">查询</el-button>
                </el-form-item>

            </el-form>
        </el-col>

        <!--列表-->
        <el-table :data="orders" highlight-current-row v-loading="listLoading" border max-height="620" style="width: 100%;">
            <el-table-column prop="username" label="供货商" show-overflow-tooltip   >
            </el-table-column>
            <el-table-column prop="downname" label="分销商" show-overflow-tooltip     >
            </el-table-column>
            <el-table-column prop="operatorname" label="运营商" show-overflow-tooltip  >
            </el-table-column>
            <el-table-column prop="provincename" label="省份" show-overflow-tooltip  >
            </el-table-column>
            <el-table-column prop="busname"  show-overflow-tooltip  label="业务类型">
            </el-table-column>
        </el-table>
        <!--工具条-->
        <el-pagination
                @current-change="handleCurrentChange"
                @size-change="handleSizeChange"
                layout="total,sizes,prev, pager, next"
                :total="total">
        </el-pagination>
    </section>
</template>

<script>
    import util from '../../common/js/util'
    //import NProgress from 'nprogress'
    import {
        findPageProductDown,
        findAllUpShopInfo,
        findAllDownShopInfo,
        findAllPro,
        findAllBus, findOpeProBusShop,
    } from '../../api/api';
    import ElOption from "../../../node_modules/element-ui/packages/select/src/option.vue";
    import moment from 'moment';

    export default {
        components: {ElOption},
        data() {
            return {
                currentNum:0,
                filters: {
                    upuseruuid:'',
                    useruuid:'',
                    operatoruid:'',
                    provinceuuid:'',
                    busuuid:'',
                },
                failtOrderDialog : false,
                total: 0,
                start: 0,
                pageSize: 10,
                listLoading: false,
                orders: [],
                users:[],
                usersUp:[],
                info:[],
                bus:[],
                dataList: [],
                fileList: [],
                operator: [],
            }
        },
        methods: {
            findAllDownShopInfo: function () {
                let para = {useruuid: JSON.parse(sessionStorage.getItem("user")).useruuid};
                findAllDownShopInfo(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else if(data) {
                        this.users = data;
                    }
                });
            },
            findAllUpShopInfo:function(){
                let para = {
                  test:''
                };
                findAllUpShopInfo(para).then(datas =>{
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.usersUp = data;
                    }
                });
            },findAllPro(){
                let para = {
                    test:''
                };
                findAllPro(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.info = data;
                    }
                });
            },findAllBus(){
                let para = {
                    test:''
                };
                findAllBus(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.bus = data;
                    }
                });
            },
            findOpeProBusShop(){
                let para = {sdffds: ''};
                findOpeProBusShop(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.operator = data.operator;
                    }
                });
            },
            findPageProductDown (){
                let para = {
                    start: this.start,
                    pageSize: this.pageSize,
                    useruuid: this.filters.useruuid == "0" ? "" : this.filters.useruuid,
                    upuseruuid: this.filters.upuseruuid == "0" ? "" : this.filters.upuseruuid,
                    operatoruid:this.filters.operatoruid == "0" ? "" : this.filters.operatoruid,
                    provinceuuid:this.filters.provinceuuid == "0" ? "" : this.filters.provinceuuid,
                    busuuid:this.filters.busuuid == "0" ? "" : this.filters.busuuid,
                };
                this.listLoading = true;
                findPageProductDown(para).then((datas) => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.orders = data.result;
                        this.total = data.totalCount;
                    }
                    this.listLoading = false;
                });
            }
            ,handleCurrentChange: function (val) {
                this.start = val - 1;
                this.findPageProductDown();
            },
            handleSizeChange: function (val) {
                this.pageSize = val;
                this.findPageProductDown();
            }
        },
        async mounted() {
            await this.findAllDownShopInfo();
            await this.findAllUpShopInfo();
            await this.findAllPro();
            await this.findAllBus();
            await this.findOpeProBusShop();
            await this.findPageProductDown();
        }
    }

</script>

<style scoped>

</style>
